<template>
	<view class="main">
		<view class="active_tit">
			<view class="tit">
				制造类
			</view> 
			<!-- <view class="add">
				＋
			</view> -->
		</view>
		<!-- input -->
		<ActiveForm required  ref='productType'>
			<view class="active_label">
				产品或业务类型：
			</view>
			<view class="active_input">
				<input type="text" v-model="form.productType" />
			</view>
		</ActiveForm>
		
		<!-- <ActiveForm required  ref='saleType'>
			<view class="active_label">
				主要销售模式：
			</view>
			<view class="active_input">
				<SelectPicker v-model="form.saleType" :options="saleTypeOptions" placeholder="请选择" />
			</view>
		</ActiveForm> -->
		
		<ActiveForm required  ref='receivablePeriod'>
			<view class="active_label">
				应收账期（月）：
			</view>
			<view class="active_input">
				<input type="number" v-model="form.receivablePeriod" />
			</view>
		</ActiveForm>
		
		<ActiveForm required  ref='turnover12month'>
			<view class="active_label">
				近12个月营业额（元）：
			</view>
			<view class="active_input">
				<mInput maxlength="16" type="number" v-model="form.turnover12month" />
			</view>
		</ActiveForm>
		
		<ActiveForm required  ref='invoiceRatio'>
			<view class="active_label">
				开票比例（%）：
			</view>
			<view class="active_input">
				<mInput :thousand='false' type="number" v-model="form.invoiceRatio" />
			</view>
		</ActiveForm>
		
		<!-- <ActiveForm required  ref='workshopArea'>
			<view class="active_label">
				厂房面积（㎡）：
			</view>
			<view class="active_input">
				<mInput type="number" v-model="form.workshopArea" />
			</view>
		</ActiveForm> -->
		
		<ActiveForm required  ref='accPayMonth'>
			<view class="active_label">
				应付账期（月）：
			</view>
			<view class="active_input">
				<input type="number" v-model="form.accPayMonth" />
			</view>
		</ActiveForm>
		
		<ActiveForm required  ref='turnoverLast12'>
			<view class="active_label">
				近13-24个月营业额（元）：
			</view>
			<view class="active_input">
				<mInput maxlength="16" type="number" v-model="form.turnoverLast12" />
			</view>
		</ActiveForm>
		<ActiveForm required ref='nextYearTurnover'>
			<view class="active_label">
				预计未来一年营业额（元）：
			</view>
			<view class="active_input">
				<mInput maxlength="16" type="number" v-model="form.nextYearTurnover" />
			</view>
		</ActiveForm>
		<ActiveForm required  ref='marginRate'>
			<view class="active_label">
				综合毛利率（%）：
			</view>
			<view class="active_input">
				<mInput :thousand='false' type="number" v-model="form.marginRate" />
			</view>
		</ActiveForm>
		
		<ActiveForm required  ref='ownYardCount'>
			<view class="active_label">
				自购/自建经营场地个数：
			</view>
			<view class="active_input">
				<mInput :thousand='false' type="number" v-model="form.ownYardCount" />
			</view>
		</ActiveForm>
		<view class="active_tit">
			
		</view>
	
		<ActiveForm  style="width: 100%;"  ref='technology'>
			<view class="active_label">
				生产工艺流程：
			</view>
			<view class="active_input">
				<textarea placeholder='最多输入800字' maxlength="800" style="width: 100%;font-size: 2.6rem;"  v-model="form.technology" />
			</view>
		</ActiveForm>

		
		
		<view class="active_tit">
			<view class="tit2">
				上下游关系信息
			</view> 
		</view>
		<view class="active_tit">
			<view class="tit2 required">
				主要客户/下游合作模式分析（前三大客户）
			</view> 
			<!-- <view class="add" @click="xiaAdd">
				＋
			</view> -->
		</view>
		<block v-for="(item,index) in xiayou" >
			<view class="cut">下游客户{{index+1}}<uni-icons class="clear" type="clear" @click='stdDel(xiayou,item,"stdOffsurIndustryUpdown")'></uni-icons></view>
			
			<view class="main">
				<ActiveForm required  ref=''>
					<view class="active_label">
						序号：
					</view>
					<view class="active_input">
						<input type="text" :disabled="true" v-model="item.xh" />
					</view>
				</ActiveForm>
				<ActiveForm required  ref='entName'>
					<view class="active_label">
						销售下游客户：
					</view>
					<view class="active_input">
						<input type="text" v-model="item.entName" />
					</view>
				</ActiveForm>
				<ActiveForm required  ref='moneyRatio'>
					<view class="active_label">
						年销售额占比（%）：
					</view>
					<view class="active_input">
						<mInput :thousand='false' type="number" v-model="item.moneyRatio" />
					</view>
				</ActiveForm>
				<ActiveForm required  ref='money'>
					<view class="active_label">
						年销售额（元）：
					</view>
					<view class="active_input">
						<mInput maxlength="16" type="number" v-model="item.money" />
					</view>
				</ActiveForm>
				<ActiveForm ref=''>
					<view class="active_label">
						详情：
					</view>
					<view class="active_input">
						<input type="text" v-model="item.exComments" />
					</view>
				</ActiveForm>
			</view>
		</block>
		<view class="active_tit">
			<!-- <view class="tit2 required">
				主要客户/下游合作模式分析（前三大客户）
			</view> -->
			<view class="add" @click="xiaAdd">
				新增客户
			</view>
		</view>
		<view class="active_tit">
			<view class="tit2 required">
				主要供应商/上游合作模式分析（前三大客户）
			</view> 
			<!-- <view class="add" @click="shangAdd">
				＋
			</view> -->
		</view>
		<block v-for="(item,index) in shangyou" >
			<view class="cut">上游商品{{index+1}}<uni-icons class="clear" type="clear" @click='stdDel(shangyou,item,"stdOffsurIndustryUpdown")'></uni-icons></view>
			<view class="main">
				<ActiveForm required  ref=''>
					<view class="active_label">
						序号：
					</view>
					<view class="active_input">
						<input type="text" :disabled="true" v-model="item.xh" />
					</view>
				</ActiveForm>
				<ActiveForm required  ref='entName'>
					<view class="active_label">
						供应商/商品名称：
					</view>
					<view class="active_input">
						<input type="text" v-model="item.entName" />
					</view>
				</ActiveForm>
				<ActiveForm required  ref='moneyRatio'>
					<view class="active_label">
						年采购占比（%）：
					</view>
					<view class="active_input">
						<mInput :thousand='false' type="number" v-model="item.moneyRatio" />
					</view>
				</ActiveForm>
				<ActiveForm required  ref='money'>
					<view class="active_label">
						年销售额（元）：
					</view>
					<view class="active_input">
						<mInput maxlength="16" type="number" v-model="item.money" />
					</view>
				</ActiveForm>
				<ActiveForm ref=''>
					<view class="active_label">
						详情：
					</view>
					<view class="active_input">
						<input type="text" v-model="item.exComments" />
					</view>
				</ActiveForm>
			</view>
		</block>
		<view class="active_tit">
			<!-- <view class="tit2 required">
				主要供应商/上游合作模式分析（前三大客户）
			</view> -->
			<view class="add" @click="shangAdd">
				新增供应商
			</view>
		</view>
		<view class="active_tit">
			<view class="tit2">
				生产情况信息
			</view> 
			<!-- <view class="add" @click="scAdd">
				＋
			</view> -->
		</view>
		<block v-for="(item,index) in scqkForm" >
			<view class="cut">生产情况{{index+1}}<uni-icons class="clear" type="clear" @click='stdDel(scqkForm,item,"stdOffsurProcuctInfo")'></uni-icons></view>
			<view class="main">
				<ActiveForm required  ref=''>
					<view class="active_label">
						序号：
					</view>
					<view class="active_input">
						<input type="text" :disabled="true" v-model="item.xh" />
					</view>
				</ActiveForm>
				<ActiveForm required  ref='maxCapacityMonth'>
					<view class="active_label">
						单月生产最大产能：
					</view>
					<view class="active_input">
						<mInput type="text" v-model="item.maxCapacityMonth" />
					</view>
				</ActiveForm>
				<ActiveForm required  ref='measurement'>
					<view class="active_label">
						计量单位（吨/件/个）：
					</view>
					<view class="active_input">
						<SelectPicker v-model="item.measurement" :options="measurementOptions" placeholder="请选择" />
					</view>
				</ActiveForm>
				<ActiveForm required  ref='perPrice'>
					<view class="active_label">
						成本价（元）：
					</view>
					<view class="active_input">
						<mInput maxlength="16" type="number" v-model="item.perPrice" />
					</view>
				</ActiveForm>
				<ActiveForm ref=''>
					<view class="active_label">
						月产值（元）：
					</view>
					<view class="active_input">
						<mInput disabled maxlength="16" type="number"
                    :value="item.maxCapacityMonth * item.perPrice"
                    @input="item.valueMonth = $event.target.value"
            />
					</view>
				</ActiveForm>
			</view>
		</block>
		<view class="active_tit">
			<!-- <view class="tit2">
				生产情况信息
			</view> -->
			<view class="add" @click="scAdd">
				新增生产情况信息
			</view>
		</view>
		<view class="active_tit">
			<view class="tit2">
				毛利率信息（挑选几款产能及销量较大的品类）
			</view> 
			<!-- <view class="add" @click="mllAdd">
				＋
			</view> -->
		</view>
		<block v-for="(item,index) in mllForm" >
			<view class="cut">毛利率{{index+1}}<uni-icons class="clear" type="clear" @click='stdDel(mllForm,item,"stdOffsurProcuctMargin")'></uni-icons></view>
			<view class="main">
				<ActiveForm required  ref=''>
					<view class="active_label">
						序号：
					</view>
					<view class="active_input">
						<input type="text" :disabled="true" v-model="item.xh" />
					</view>
				</ActiveForm>
				<ActiveForm required  ref='goodName'>
					<view class="active_label">
						商品名称：
					</view>
					<view class="active_input">
						<input type="text" v-model="item.goodName" />
					</view>
				</ActiveForm>
				<ActiveForm required  ref='materialsCost'>
					<view class="active_label">
						原材料成本（元）：
					</view>
					<view class="active_input">
						<mInput   v-model="item.materialsCost" />
					</view>
				</ActiveForm>
				<ActiveForm required  ref='laborCost'>
					<view class="active_label">
						人工成本（元）：
					</view>
					<view class="active_input">
						<mInput  maxlength="16" type="number" v-model="item.laborCost" />
					</view>
				</ActiveForm>
				<ActiveForm required  ref='waterCost'>
					<view class="active_label">
						水费成本（元）：
					</view>
					<view class="active_input">
						<mInput  maxlength="16" type="number" v-model="item.waterCost" />
					</view>
				</ActiveForm>
				<ActiveForm required  ref='electricCost'>
					<view class="active_label">
						电费成本（元）：
					</view>
					<view class="active_input">
						<mInput  maxlength="16" type="number" v-model="item.electricCost" />
					</view>
				</ActiveForm>
				<ActiveForm required  ref='otherCost'>
					<view class="active_label">
						其他成本（元）：
					</view>
					<view class="active_input">
						<mInput  maxlength="16" type="number" v-model="item.otherCost" />
					</view>
				</ActiveForm>
				<ActiveForm required  ref='outPrice'>
					<view class="active_label">
						售价（元）：
					</view>
					<view class="active_input">
						<mInput maxlength="16" type="number" v-model="item.outPrice" />
					</view>
				</ActiveForm>
				<!-- <ActiveForm required  ref='outPrice'  v-if="!item.marginRate||item.marginRate==-Infinity">
					<view class="active_label">
						毛利率（%）：
					</view>
					<view class="active_input">
						<mInput :thousand='false' maxlength="16" disabled type="number" v-model.number="item.marginRate='0'" />
					</view>
				</ActiveForm> -->
				<ActiveForm ref='' >
					<view class="active_label">
						毛利率（%）：
					</view>
					<view class="active_input">
						<input disabled  :value="zmarginRate(item)" />
					</view>
				</ActiveForm>
			</view>
		</block>
		<view class="active_tit">
			<!-- <view class="tit2">
				毛利率信息（挑选几款产能及销量较大的品类）
			</view> -->
			<view class="add" @click="mllAdd">
				新增毛利率信息
			</view>
		</view>
		<view class="active_tit">
			<view class="tit2">
				销售额信息
			</view> 
		</view>
		<ActiveForm class="active_form" required  ref='busyMonths' style="width: 50%;">
			<view class="active_label" style="width: 22rem;">
				旺季月份：
			</view>
			<view class="active_input">
				<jsfun-picker style="width: 100%;height: 4rem;" mess="备注：旺季,一般,淡季请选择不重复月份" :listArr="priceList" :defaultArr="xseForm.busyMonths"
				 type="multiple" @click="priceChange1">
					<!-- 自定义页面显示元素 -->
					<view class="sl">
						{{xseForm.busyMonths}}
					</view>
				</jsfun-picker>
				<!-- <input type="number" v-model="xseForm.busyMonths" /> -->
			</view>
		</ActiveForm>
		
		<ActiveForm class="active_form" required  ref='busyTurnover' style="width: 50%;">
			<view class="active_label">
				旺季月均销售额（元）：
			</view>
			<view class="active_input">
				<mInput maxlength="16" type="number" v-model="xseForm.busyTurnover" />
			</view>
		</ActiveForm>
		
		<ActiveForm class="active_form" required  ref='middleMonths' style="width: 50%;">
			<view class="active_label" style="width: 22rem;">
				一般月份：
			</view>
			<view class="active_input">
				<jsfun-picker style="width: 100%;height: 4rem;" mess="备注：旺季,一般,淡季请选择不重复月份" :listArr="priceList" :defaultArr="xseForm.middleMonths"
				 type="multiple" @click="priceChange2">
					<!-- 自定义页面显示元素 -->
					<view class="sl">
						{{xseForm.middleMonths}}
					</view>
				</jsfun-picker>
				<!-- <input type="number" v-model="xseForm.middleMonths" /> -->
			</view>
		</ActiveForm>
		<ActiveForm class="active_form" required  ref='middleTurnover' style="width: 50%;">
			<view class="active_label">
				一般月份销售额（元）：
			</view>
			<view class="active_input">
				<mInput maxlength="16" type="number" v-model="xseForm.middleTurnover" />
			</view>
		</ActiveForm>
		<ActiveForm class="active_form" required  ref='lowMonths' style="width: 50%;">
			<view class="active_label" style="width: 22rem;">
				淡季月份：
			</view>
			<view class="active_input">
				<jsfun-picker style="width: 100%;height: 4rem;" mess="备注：旺季,一般,淡季请选择不重复月份" :listArr="priceList" :defaultArr="xseForm.lowMonths"
				 type="multiple" @click="priceChange3">
					<!-- 自定义页面显示元素 -->
					<view class="sl">
						{{xseForm.lowMonths}}
					</view>
				</jsfun-picker>
				<!-- <input type="text" v-model="xseForm.lowMonths" /> -->
			</view>
		</ActiveForm>
		<ActiveForm class="active_form" required  ref='lowTurnover' style="width: 50%;">
			<view class="active_label">
				淡季月份销售额（元）：
			</view>
			<view class="active_input">
				<mInput maxlength="16" type="number" v-model="xseForm.lowTurnover" />
			</view>
		</ActiveForm>
		<!-- <button type="default" @click="getForm">getForm</button> -->
	</view>
</template>

<script>
	import SelectPicker from "../../../SelectPicker";
	import RegionPicker from "../../../RegionPicker";
	import jsfunPicker from '@/components/jsfun-picker/jsfun-picker.vue'
	export default {
		name: 'activeForm',
		data() {
			return {
				priceList: ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月'],
				province: "",
				city: "",
				county: "",
				index: 1,
				shangyou:[],
				xiayou:[],
				xseForm:[],
				mllForm:[],
				scqkForm:[],
				form: {},
				saleTypeOptions:[],
				measurementOptions:[]
			}
		},
		components: {
			SelectPicker,
			RegionPicker,
			jsfunPicker
		},
		computed:{
			zmarginRate() {
				return function(item) {
					//item.marginRate=(((1-(Number(item.materialsCost))/Number(item.outPrice)))*100).toFixed(2)
					if (Number(item.outPrice) <= 0) {
						item.marginRate = 0
						return 0
					} else {
						//laborCost  人工成本
						//waterCost  水费成本
						//electricCost 电费成本
						//otherCost 其他成本
						let lv = (((1-(Number(item.materialsCost)+Number(item.laborCost)+Number(item.waterCost)+Number(item.electricCost)+Number(item.otherCost))/Number(item.outPrice)))*100).toFixed(2)
						item.marginRate = lv
						return lv
					}
			
					
			
				}
			}
		},
			
		watch:{
			xseForm:{
				handler:function(res){
					//console.warn('销售额数据变化',res)
					getApp().globalData.stdOffsurIndustryTurnover = res
				},
				deep:true
			},
			mllForm:{
				handler:function(res){
					//console.warn('毛利率数据变化',res)
					getApp().globalData.stdOffsurProcuctMargin = res
				},
				deep:true
			},
			scqkForrm:{
				handler:function(res){
					//console.warn('生产情况数据变化',res)
					getApp().globalData.stdOffsurProcuctInfo = res
				},
				deep:true
			},
			form:{
				handler:function(res){
					//console.warn('manufacturing组件数据变化',res)
					getApp().globalData.stdOffsurProcuct = res
				},
				deep:true
			},
			shangyou:{
				handler: function(res) {
					//console.warn('shangyou', res)
					getApp().globalData.shangyou02 = res
				},
				deep: true
			},
			xiayou:{
				handler: function(res) {
					//console.warn('xiayou', res)
					getApp().globalData.xiayou02 = res
				},
				deep: true
			}
		},
		mounted() {
			let a =
			//获取返显数据
			setTimeout(()=>{
				//数据反显
				this.form = getApp().globalData.stdOffsurProcuct
				this.scqkForm = getApp().globalData.stdOffsurProcuctInfo
				this.mllForm = getApp().globalData.stdOffsurProcuctMargin
				this.xseForm = getApp().globalData.stdOffsurIndustryTurnover
				this.saleTypeOptions = getApp().globalData.optType.SALETYPE
				this.measurementOptions = getApp().globalData.optType.MEAS
				let arr = getApp().globalData.stdOffsurIndustryUpdown
				for(let i=0;i<arr.length;i++){
					if(arr[i].industry=='02'&&arr[i].updownFlag=='01'){
						this.shangyou.push(arr[i])
					}else if(arr[i].industry=='02'&&arr[i].updownFlag=='02'){
						this.xiayou.push(arr[i])
					}
				}
				this.priceList = ['1月', '2月', '3月', '4月', '5月', '6月', '7月', '8月', '9月', '10月', '11月', '12月']
			},getApp().globalData.timeout)
		},
		methods:{
			mllAdd(){
				this.mllForm.push(
				{
					"xh": this.mllForm.length+1,
					materialsCost:'',
					laborCost:'',
					waterCost:'',
					electricCost:'',
					otherCost:'',
					outPrice:''
				}
				)
			
			},
			scAdd(){//item.maxCapacityMonth*item.perPrice
				this.scqkForm.push({"xh": this.scqkForm.length+1,maxCapacityMonth:0,perPrice:0})
			},
			xiaAdd(){
				let obj={
					"businessId": "",
					"createTime": "",
					"createUser": "",
					"customerId": "",
					"customerSystemId": "",
					"deleteFlag": "",
					"entId": "",
					"entName": "",
					"entityRoleType": "",
					"exComments": "",
					"getDatTime": "",
					"imageUrl": "",
					"industry": '02',
					"money": 0,
					"moneyRatio": 0,
					"reqId": "",
					"sourceSystem": "",
					"updateTime": "",
					"updateUser": "",
					"updownFlag": "02",
					"uuid": "",
					"xh": this.xiayou.length+1
				}
				
				if(this.xiayou.length<3){
					this.xiayou.push(obj)
				}else{
					uni.showToast({
						title: '已添加三条信息，无法继续增加',
						icon: "none",
						duration: 2000
					})
				}
			},
			shangAdd(){
				let obj={
					"businessId": "",
					"createTime": "",
					"createUser": "",
					"customerId": "",
					"customerSystemId": "",
					"deleteFlag": "",
					"entId": "",
					"entName": "",
					"entityRoleType": "",
					"exComments": "",
					"getDatTime": "",
					"imageUrl": "",
					"industry": '02',
					"money": 0,
					"moneyRatio": 0,
					"reqId": "",
					"sourceSystem": "",
					"updateTime": "",
					"updateUser": "",
					"updownFlag": "01",
					"uuid": "",
					"xh": this.shangyou.length+1
				}
				
				if(this.shangyou.length<3){
					this.shangyou.push(obj)
				}else{
					uni.showToast({
						title: '已添加三条信息，无法继续增加',
						icon: "none",
						duration: 2000
					})
				}
			},
			priceChange1(data) {
				if(this.xseForm.busyMonths===null){
					this.xseForm.busyMonths=''
				}
				if(this.xseForm.middleMonths===null){
					this.xseForm.middleMonths=''
				}
				if(this.xseForm.lowMonths===null){
					this.xseForm.lowMonths=''
				}
				let flag = false
				let removeArr = [...this.xseForm.middleMonths.split(','),...this.xseForm.lowMonths.split(',')]
				let arr = data.textStr.split(',')
				for(let i=0;i<arr.length;i++){
					for(let j=0;j<removeArr.length;j++){
						if(arr[i]==removeArr[j]){
							arr.remove(arr[i])
							flag = true
						}
					}
				}
				
				setTimeout(()=>{
					if(flag){
						uni.showToast({
							title:'选择有重复，已自动移除',
							icon:"none",
							duration:2000
						})
						data.textStr = arr.toString()
						this.xseForm.busyMonths = arr.toString()
					}else{
						this.xseForm.busyMonths = data.textStr
					}
				},300)
			    
				
				
			},
			priceChange2(data) {
				if(this.xseForm.busyMonths===null){
					this.xseForm.busyMonths=''
				}
				if(this.xseForm.middleMonths===null){
					this.xseForm.middleMonths=''
				}
				if(this.xseForm.lowMonths===null){
					this.xseForm.lowMonths=''
				}
				let flag = false
				let removeArr = [...this.xseForm.busyMonths.split(','),...this.xseForm.lowMonths.split(',')]
				let arr = data.textStr.split(',')
				for(let i=0;i<arr.length;i++){
					for(let j=0;j<removeArr.length;j++){
						if(arr[i]==removeArr[j]){
							arr.remove(arr[i])
							flag = true
						}
					}
				}
				
				setTimeout(()=>{
					if(flag){
						uni.showToast({
							title:'选择有重复，已自动移除',
							icon:"none",
							duration:2000
						})
						data.textStr = arr.toString()
						this.xseForm.middleMonths = arr.toString()
					}else{
						this.xseForm.middleMonths = data.textStr
					}
				},300)
				
			
			},
			priceChange3(data) {
				if(this.xseForm.busyMonths===null){
					this.xseForm.busyMonths=''
				}
				if(this.xseForm.middleMonths===null){
					this.xseForm.middleMonths=''
				}
				if(this.xseForm.lowMonths===null){
					this.xseForm.lowMonths=''
				}
				let flag = false
				let removeArr = [...this.xseForm.busyMonths.split(','),...this.xseForm.middleMonths.split(',')]
				let arr = data.textStr.split(',')
				for(let i=0;i<arr.length;i++){
					for(let j=0;j<removeArr.length;j++){
						if(arr[i]==removeArr[j]){
							arr.remove(arr[i])
							flag = true
						}
					}
				}
				
				setTimeout(()=>{
					if(flag){
						uni.showToast({
							title:'选择有重复，已自动移除',
							icon:"none",
							duration:2000
						})
						data.textStr = arr.toString()
						this.xseForm.lowMonths = arr.toString()
					}else{
						this.xseForm.lowMonths = data.textStr
					}
				},300)
			
				
			
			},
		}
	}
</script>

<style lang="scss">
	
	
</style>


